var banner = document.querySelector('.banner');
var imgLis = document.querySelectorAll('.banner .img-list li');
var indicators = document.querySelectorAll('.banner .indicator li');
var activeMove = document.querySelector('.active-move');
var index = 0;//记录当前图片的索引值
function showImg(){
    for(var i = 0; i < imgLis.length; i++){
        // 先把所有图片隐藏，所有指示灯的背景去掉
        imgLis[i].className = '';
        indicators[i].className = '';
    }
    // 根据index的值，来显示图片和改变指示灯，banner的背景
    imgLis[index].className = 'current';
    indicators[index].className = 'active';
    left = indicators[index].offsetLeft;
    activeMove.style.left = left + 'px';
    
    
}
function prevImg(){
    index = index==0 ? imgLis.length-1 : index-1;
    showImg();
}
function nextImg(){
    index = index==imgLis.length-1 ? 0 : index+1;
    showImg();
}

var timer = setInterval(nextImg,1500);

// 鼠标进入容器，自动切换停下来
banner.onmouseover = function(){
    clearInterval(timer);
    timer = null;
}
banner.onmouseout = function(){
    timer = setInterval(nextImg,1500);
}
// 点击切换图片
for(var i = 0; i < indicators.length; i++){
    indicators[i].index = i;
    indicators[i].onclick = function(){
        index = this.index;
        showImg();
    }
}
// 返回顶部
    var backToTop = document.querySelector('.backtotop');
    backToTop.onclick = function(){
       document.documentElement.scrollTop =
       document.body.scrollTop = 0;
    }
// 动态固定导航
var nav = document.querySelector('.back');
    window.onscroll = function(){
        var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
        // console.log(scrollTop);9
        
        if (scrollTop >= 150) {
            // 固定nav
            nav.style.position = 'fixed';
            nav.style.top = '0';
        }else{
            // 去除固定位置的效果
            nav.style.position = 'static';
            nav.style.top = '-100px';
        }

    }